<template>
	<view>
		<view class="search">
			<uni-search-bar placeholder="搜索商品" cancelButton="none" @confirm="search" @input="" />
		</view>
		<view class="histop">
			历史记录
		</view>
		<view class="history">
			<view class="tags" v-for="item in history" :key="item">
				<uni-tag :circle="true" :custom-style="styles" :text="item" type="primary" @click="search1(item)" />
			</view>

		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				styles: "background-color: #e3e3e3; border-color: #e3e3e3; color: #464646;font-size: 16px;",
				history: ['土豆', '西红柿', '小葱', '牛肉', '苹果']
			}
		},
		methods: {
			search1(data) {
				uni.navigateTo({
					url: "/pagesOne/searchList/searchList?title=" + data
				})
			},
			search(data) {
				if (data.value) {
					uni.navigateTo({
						url: "/pagesOne/searchList/searchList?title=" + data.value
					})
				}

			}
		}
	}
</script>

<style lang="scss">
	.search {
		margin-top: 10px;
	}

	.history {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;

	}

	.histop {
		margin: 10px;
		font-weight: bold;
		font-size: 18px;
	}

	.tags {
		margin: 10px;
	}
</style>
